<template>
  <div class="panel_title">
    <div class="title-text">{{ props.title }}</div>
    <slot></slot>
  </div>
</template>

<script setup>
const props = defineProps({
  title: {
    type: String,
    required: true,
  },
});
</script>

<style scoped lang="scss">
.panel_title {
  height: vh(27);
  background: linear-gradient(90deg, #095472 0%, rgba(2, 17, 21, 0) 100%);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.title-text {
  color: #fff;
  font-family: Source Han Sans CN;
  font-weight: 400;
  font-size: vh(14);
  color: #ffffff;
  line-height: 27px;
}
.title-text::before {
  content: "";
  display: inline-block;
  margin-right: vw(15);
  width: vw(2);
  height: vh(11);
  background: #00ffea;
}
</style>